<template>
  <div>
    <slot name="header"></slot>
    <h1>我是子组件</h1>
    <!-- 默认插槽 没有名字的插槽
    父组件传递的内容 自动传递进入 -->
    <slot :num="888"></slot>
    <!-- 具名插槽 -->

    <h1>插槽在上面</h1>
    <!-- 2.6版本以下  slot="footer" 
    2.6版本 name="footer" -->
      <slot name="footer"></slot>
      <!-- 作用域插槽  可以完成父子组件的之间双向数据传递
      作用域插槽 用自定义属性 像父组件传数据
    -->
      <slot name="mydes" :item="myitem">
         
      </slot>
      <!-- 作用域插槽 -->
       <slot name="myprice" :myprice="price" :myitem="list">
         
      </slot>
      
  </div>
</template>

<script>
export default {
  name: '2209vueMyZI',

  data() {
    return {
      myitem:{
        id:111,
        name:"小王",
        age:18,
        sex:"男"
      },
      list:["赵云","小马云","范晓琪"],
      price:19999
    };
  },

  mounted() {
    
  },

  methods: {
    
  },
};
</script>